import { defineConfig, loadEnv } from 'vite'
import vue from '@vitejs/plugin-vue'
import { fileURLToPath, URL } from 'node:url'
import postcssPluginPx2rem from "postcss-plugin-px2rem";
import autoprefixer from "autoprefixer";
import path from "path";
export default defineConfig(({ command, mode }) => {
  // 获取配置的环境变量
  const env = loadEnv(mode, process.cwd())
  const px2remOptions = {
    // rootValue: 100,  //换算基数， 默认100 ,也就是1440px ，这样的话把根标签的字体规定为1rem为50px,这样就可以从设计稿上量出多少个px直接在代码中写多少px了
    unitPrecision: 5, //允许REM单位增长到的十进制数字，其实就是精度控制
    // mediaQuery: false, //（布尔值）允许在媒体查询中转换px
    // minPixelValue: 0  //设置要替换的最小像素值(3px会被转rem)。 默认 0
  };
  return {
    base: './',
    plugins: [vue()],
    resolve: {
      alias: {
        '@': fileURLToPath(new URL('./src', import.meta.url))
      }
    },
    server: {
      proxy: {
        '/devapi': {
          target: 'http://192.168.8.20:8051', //公司
          changeOrigin: true,
          rewrite: (path) => path.replace(/^\/devapi/, '/bdmap_server'),
          bypass(req, res, options) {
            const realUrl = options.target + (options.rewrite ? options.rewrite(req.url) : '')
            res.setHeader('A-Real-Url', realUrl) // 添加响应标头(A-Real-Url为自定义命名)，在接口response headers 可以看到真实请求地址
          }
        }
      }
    },
    css: {
      postcss: {
        plugins: [
          postcssPluginPx2rem(px2remOptions),
          autoprefixer({
            overrideBrowserslist: [
              "defaults",
              "not ie < 11",
              "last 10 versions",
              "> 1%"
            ],
          })
        ]
      },
    },
  }
})
